<!DOCTYPE html>
<style>
#scroller {
    overflow: scroll;
    width: 400px;
    height: 400px;
}
#space {
    width: 1200px;
    height: 900px;
}
</style>
<div id="scroller"><div id="space"></div></div>
<script src="../resources/run-after-layout-and-paint.js"></script>
<script>
    var styleElement = document.createElement("style");
    var sheet = document.head.appendChild(styleElement).sheet;
    runAfterLayoutAndPaint(function() {
        sheet.insertRule("::-webkit-scrollbar { width: 30px; height: 30px; }", 0);
        sheet.insertRule("::-webkit-scrollbar-thumb { background: green; }", 1);
    }, true);
</script>